<template>
	<view>
		<view>
			
			<view class="repDevice" style="margin-top: 40rpx;">维修说明</view>
			<view class="repCheckout"  >
				<textarea class="inputSty uni-input" maxlength="80" v-model="obj.repairDesc" />
				<!-- 维修管理员说明信息 -->
			</view>
			<!-- <view class="repDevice" style="margin-top:60rpx;">图片</view> -->
			<view style="position: relative;" >
				
				<view class="repDevice" style=" transform: translate(-50%, -50%);position: absolute;top:50%;left:50%">没有提供图片</view>
				<image  :src="imgShow" class="imgSty" mode=""></image>
			</view>
			
			<view style="width: 85%;margin: 0 auto;">
				<button @click="commit(2)" style="background-color: #2934D1; margin-top: 50rpx;color: white;">确认完成</button>
				<button  @click="commit(1)" type="warn" style="margin-top: 50rpx;">未完成</button>
			</view>
			<!-- <view class="logoSty"></view> -->
		</view>
		<!-- <my-bottom :bottomArr="Repbottoms"></my-bottom> -->
	</view>
</template>

<script>
	import * as imageConversion from 'image-conversion'
	import topCom from '../component/topCom.vue'
	import bottomCom from '../component/bottom.vue'
	import headTitle from '../component/btnHeadeCom.vue'
	import {
		pathToBase64,
		base64ToPath
	} from '../../utils/index.js'
	export default {
		name: 'repStatus',
		data() {
			return {
				file: {},
				mainTitle: '完成维修',
				topName: '202宿舍',
				userName: '',
				titleHead: '正在处理',
				dormitoryNo: '',
				imgShow: '',
				Repbottoms: [{
						name: 'home',
						icon: 'iconfont icon-baoxiu',
						text: "首页",
						path: '/pages/maintenance/maintenanceIndex'
					},
					{
						name: 'atttendance',
						icon: 'iconfont icon-bi',
						text: "统计",
						path: '/pages/maintenance/maintenanceIndex'
					},
					{
						name: 'maintenance',
						icon: 'iconfont icon-shezhi',
						text: "设置",
						path: '/pages/maintenance/maintenanceIndex'
					}
				],
				repairDesc: '',
				deviceIds: [],
				repairId: 0,
				className: '',
				bdormitoryId: 1,
				classId: 1,
				obj:{}
			}
		},
		onShow() {
			
			this.userName = uni.getStorageSync("loginName")
			
			
		},


		async onLoad(options) {
			var  res = await this.$api.maintenance.getRepairInfoById(options.id);
			console.log(res)
			this.obj = res.data;
			// uni.request({
			// 	url:uni.url+'Repair/getRepairInfoByld?repairld='+options.id
			// })
			// var data = JSON.parse(options.obj)
			// this.obj = data;
			// console.log(data);
			this.imgShow ='data:image/png;base64,'+ this.obj.photo
			// // this.obj.photo = 'data:image/gif;base64,' + res.data.photo 
			
			this.topName  = options.str
		},
		mounted() {
			

		},
		methods: {
			commit(status){
				// this.$api.maintenance.updateClassRepair(this.obj.id,status,  '', '')
				uni.request({
					url:uni.url+'Repair/updateRepair',
					data:{
						status,
						id:this.obj.id
					},
					method:'post',
					complete: () => {
						uni.showToast({
							title:"操作成功",
							icon:"none"
						})
						uni.navigateTo({
							url:"/pages/maintenance/weixiuList"
						})
					}
				})
			},
			// chooseImage() {
			// 	uni.chooseImage({
			// 		count: 1,
			// 		sourceType: ['album', 'camera'],
			// 		sizeType: ['compressed'],
			// 		success: async res => {
			// 			console.log(res)
			// 			this.imgShow = res.tempFilePaths[0]; //500kb
			// 			this.file = await imageConversion.compressAccurately(res.tempFiles[0], 500)
			// 			// this.file = res.tempFiles[0];
			// 		}
			// 	})
				
			// }

		},
		components: {
			topCom,
			bottomCom,
			headTitle
		},
	}
</script>

<style>
	.inputSty {
		word-wrap: break-word;
		font-size: 36rpx;
		color: #8F8F94;
		padding: 10rpx;
		width: 620rpx;
		height: 180rpx;
		word-break: break-all;
		white-space: inherit;
	}

	.imgSty {
		border: solid 1upx #999999;
		border-radius: 20upx;
		width: 600rpx;
		height: 520rpx;

		padding: 10upx;
		margin-left: 50rpx;
		margin-top: 0rpx
	}

	.repDevice {
		text-align: left;
		font-size: 32upx;
		color: #808080;
		/* padding-left: 50upx; */
	}

	.repText {
		border: solid 1upx #999999;
		border-radius: 20upx;
		width: 500upx;
		height: 150upx;
		margin: auto;
		padding: 10upx;
	}

	.repCheckout {
		height: 150rpx;
		font-size: 28upx;
		color: #808080;
		margin-top: 30upx;
		width: 720rpx;
		margin-left: 50upx;
	}

	.repDevice {
		text-align: left;
		font-size: 42rpx;
		color: #808080;
		padding-left: 50upx;
	}

	.leaveNav {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: row;
		font-size: 36upx;
		color: blue;
		width: 100%;
		padding: 50upx
	}

	.leaveBtn {
		background-image: url(https://tj-1305380059.cos.ap-nanjing.myqcloud.com/pic/tubiao-01.png);
		width: 190upx;
		height: 60upx;
		color: white;
		font-size: 26upx;
		font-weight: 0;
	}

	.leaveLine {
		width: 200upx;
		height: 8upx;
		background: rgba(239, 220, 11, 1.0);
		opacity: 0.78;
		position: relative;
		bottom: 0upx;
		left: -30upx;
	}

	.leaveMgm {
		color: #808080;
		font-size: 28upx;
	}

	.leaveCheck {
		margin-left: 60upx;
		margin-bottom: 30upx;
	}
</style>
